﻿<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">


    <!-- The scroll bar colors can be customised here, but by default
    they are based on the zune colors. -->
    <Color x:Key="ScrollBarLightColor">#BFBFBF</Color>
    <Color x:Key="ScrollBarMediumColor">#A7A5A5</Color>
    <Color x:Key="ScrollBarDarkColor">#F10DA2</Color>

    <!-- Brushes for the scrollbars, based on the scroll bar colors. -->
    <SolidColorBrush x:Key="ScrollBarLightBrush" Color="{StaticResource ScrollBarLightColor}" />
    <SolidColorBrush x:Key="ScrollBarMediumBrush" Color="{StaticResource ScrollBarMediumColor}" />
    <SolidColorBrush x:Key="ScrollBarDarkBrush" Color="{StaticResource ScrollBarDarkColor}" />

    <Style TargetType="ScrollBar">
        <Setter Property="Background" Value="{StaticResource ScrollBarLightBrush}"/>
        <Setter Property="MinWidth" Value="17" />
        <Setter Property="MinHeight" Value="17" />
        <Setter Property="IsTabStop" Value="False"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ScrollBar">
                    <Grid x:Name="Root" Background="Transparent">
                        <Grid.Resources>
                            
                            <ControlTemplate x:Key="RepeatButtonTemplate" TargetType="RepeatButton">
                                <Grid x:Name="Root" Background="Transparent">
                                    <VisualStateManager.VisualStateGroups>
                                        <VisualStateGroup x:Name="CommonStates">
                                            <VisualState x:Name="Normal"/>
                                        </VisualStateGroup>
                                    </VisualStateManager.VisualStateGroups>
                                </Grid>
                            </ControlTemplate>
                            
                            <ControlTemplate x:Key="VerticalThumbTemplate" TargetType="Thumb">
                                <Grid>
                                    <VisualStateManager.VisualStateGroups>
                                        <VisualStateGroup x:Name="CommonStates">
                                            <VisualState x:Name="Normal">
                                                <Storyboard>
                                                    <ColorAnimation
                                                        Storyboard.TargetName="thumbBrush"
                                                        Storyboard.TargetProperty="Color"
                                                        To="{StaticResource ScrollBarMediumColor}"
                                                        Duration="0:0:0.2" />
                                                    <DoubleAnimation
                                                        Storyboard.TargetName="ThumbVisual"
                                                        Storyboard.TargetProperty="Width"
                                                        To="3"
                                                        Duration="0:0:0.2">
                                                        <DoubleAnimation.EasingFunction>
                                                            <CubicEase EasingMode="EaseOut" />
                                                        </DoubleAnimation.EasingFunction>
                                                    </DoubleAnimation>
                                                </Storyboard>
                                            </VisualState>
                                            <VisualState x:Name="MouseOver">
                                                <Storyboard>
                                                    <ColorAnimation
                                                        Storyboard.TargetName="thumbBrush"
                                                        Storyboard.TargetProperty="Color"
                                                        To="{StaticResource ScrollBarDarkColor}"
                                                        Duration="0:0:0.2" />
                                                    <DoubleAnimation
                                                        Storyboard.TargetName="ThumbVisual"
                                                        Storyboard.TargetProperty="Width"
                                                        To="30"
                                                        Duration="0:0:0.2">
                                                        <DoubleAnimation.EasingFunction>
                                                            <CubicEase EasingMode="EaseOut" />
                                                        </DoubleAnimation.EasingFunction>
                                                    </DoubleAnimation>
                                                </Storyboard>
                                            </VisualState>
                                            <VisualState x:Name="Disabled">
                                                <Storyboard>
                                                    <DoubleAnimation Duration="0:0:0" To="0" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="ThumbVisual"/>
                                                </Storyboard>
                                            </VisualState>
                                        </VisualStateGroup>
                                    </VisualStateManager.VisualStateGroups>
                                    
                                    <Border x:Name="ThumbVisual" Width="3" HorizontalAlignment="Center">
                                        <Border.Background>
                                            <SolidColorBrush 
                                                x:Name="thumbBrush" Color="{StaticResource ScrollBarMediumColor}" />
                                        </Border.Background>
                                    </Border>
                                </Grid>
                            </ControlTemplate>

                            <ControlTemplate x:Key="HorizontalThumbTemplate" TargetType="Thumb">
                                <Grid>
                                    <VisualStateManager.VisualStateGroups>
                                        <VisualStateGroup x:Name="CommonStates">
                                            <VisualState x:Name="Normal">
                                                <Storyboard>
                                                    <ColorAnimation
                                                        Storyboard.TargetName="thumbBrush"
                                                        Storyboard.TargetProperty="Color"
                                                        To="{StaticResource ScrollBarMediumColor}"
                                                        Duration="0:0:0.2" />
                                                    <DoubleAnimation
                                                        Storyboard.TargetName="ThumbVisual"
                                                        Storyboard.TargetProperty="Height"
                                                        To="3"
                                                        Duration="0:0:0.2">
                                                        <DoubleAnimation.EasingFunction>
                                                            <CubicEase EasingMode="EaseOut" />
                                                        </DoubleAnimation.EasingFunction>
                                                    </DoubleAnimation>
                                                </Storyboard>
                                            </VisualState>
                                            <VisualState x:Name="MouseOver">
                                                <Storyboard>
                                                    <ColorAnimation
                                                        Storyboard.TargetName="thumbBrush"
                                                        Storyboard.TargetProperty="Color"
                                                        To="{StaticResource ScrollBarDarkColor}"
                                                        Duration="0:0:0.2" />
                                                    <DoubleAnimation
                                                        Storyboard.TargetName="ThumbVisual"
                                                        Storyboard.TargetProperty="Height"
                                                        To="30"
                                                        Duration="0:0:0.2">
                                                        <DoubleAnimation.EasingFunction>
                                                            <CubicEase EasingMode="EaseOut" />
                                                        </DoubleAnimation.EasingFunction>
                                                    </DoubleAnimation>
                                                </Storyboard>
                                            </VisualState>
                                            <VisualState x:Name="Disabled">
                                                <Storyboard>
                                                    <DoubleAnimation Duration="0:0:0" To="0" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="ThumbVisual"/>
                                                </Storyboard>
                                            </VisualState>
                                        </VisualStateGroup>
                                    </VisualStateManager.VisualStateGroups>

                                    <Border x:Name="ThumbVisual" Height="3" VerticalAlignment="Center">
                                        <Border.Background>
                                            <SolidColorBrush 
                                                x:Name="thumbBrush" Color="{StaticResource ScrollBarMediumColor}" />
                                        </Border.Background>
                                    </Border>
                                </Grid>
                            </ControlTemplate>

                        </Grid.Resources>
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="CommonStates">
                                <VisualState x:Name="Normal"/>
                                <VisualState x:Name="MouseOver"/>
                                <VisualState x:Name="Disabled">
                                    <Storyboard>
                                        <DoubleAnimation Duration="0" To="0.5" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="Root"/>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>

                        
                        <Grid x:Name="VerticalRoot" Visibility="Collapsed">
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition Height="*"/>
                                <RowDefinition Height="Auto"/>
                            </Grid.RowDefinitions>
                            
                            <Border
                                Grid.RowSpan="5"
                                Width="1" HorizontalAlignment="Center"
                                Background="{TemplateBinding Background}" />
                            <RepeatButton 
                                x:Name="VerticalLargeDecrease" Height="0" IsTabStop="False" Interval="50" 
                                Grid.Row="1" Template="{StaticResource RepeatButtonTemplate}"/>
                                <Thumb 
                                    x:Name="VerticalThumb" Height="18" MinHeight="18" Grid.Row="2" 
                                     HorizontalAlignment="Center"
                                    Template="{StaticResource VerticalThumbTemplate}" />
                           <RepeatButton 
                                x:Name="VerticalLargeIncrease" IsTabStop="False" Interval="50"
                                Grid.Row="3" Template="{StaticResource RepeatButtonTemplate}" />
                        </Grid>


                        <Grid x:Name="HorizontalRoot" Visibility="Collapsed">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="Auto"/>
                                <ColumnDefinition Width="Auto"/>
                                <ColumnDefinition Width="Auto"/>
                                <ColumnDefinition Width="*"/>
                                <ColumnDefinition Width="Auto"/>
                            </Grid.ColumnDefinitions>
                            <Border
                                Grid.ColumnSpan="5"
                                Height="1" VerticalAlignment="Center"
                                Background="{TemplateBinding Background}" />
                            <RepeatButton 
                                x:Name="HorizontalLargeDecrease" Width="0" IsTabStop="False" Interval="50" 
                                Grid.Column="1" Template="{StaticResource RepeatButtonTemplate}"/>
                            <Thumb 
                                x:Name="HorizontalThumb" Width="18" MinWidth="18" Grid.Column="2" 
                                VerticalAlignment="Center"
                                Template="{StaticResource HorizontalThumbTemplate}" />
                            <RepeatButton 
                                x:Name="HorizontalLargeIncrease" IsTabStop="False" Interval="50"
                                Grid.Column="3" Template="{StaticResource RepeatButtonTemplate}" />
                        </Grid>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

</ResourceDictionary>